<template>
    <div>
      <fbr></fbr>
      <div>
        <div class="flex-c">
          <img style="width: 28px;height: 28px;" :src="require('@/assets/img/email.png')">
          <div style="font-size: 20px;margin-left: 20px;font-weight: 700;">桶名称</div>
          </div>
        <div class="flex-c" style="margin: 40px;">
          <div class="mr60">存储类别：pudssa.o3 | 160核 | 256GB</div>
          <div class="mr60">数据冗余存储策略：pudssa.o3 | 160核</div>
          <div class="mr60">区域：1</div>
          <div class="mr60">创建时间：单实例</div>
        </div>
      </div>
      <fbr></fbr>
      <listPage
      ref="listPageRef"
      pageTitle="对象信息"
      :btnList="btnList"
      :addBtnList="addBtnList"
      :tableData="tableData"
      :allColumn="tableColumn"
      :tableColumn="showColumn"
      @setColumn="(val)=>{showColumn=val}"
      ></listPage>
      <!-- 查看版本弹窗 -->
      <pdlog v-model="showEdit" width="581px" title="查看版本" @comfirm="showEdit = false" @cencel="showEdit = false">
          <plist ref="pList" size="mini" :tableData="tableData3" :tableColumn="tableColumn3" :hasIndex="false" >
        </plist>
      </pdlog>
      <!-- 上传对象弹窗 -->
      <pdlog v-model="showLog" width="581px" title="上传对象" @comfirm="showLog=false" @cencel="showLog = false">
        <div class="edit-dialog">
          <div class="name">存储类别</div>
          <el-radio-group v-model="logValue">
            <el-radio :label="1">标准存储</el-radio>
            <el-radio :label="2">低频访问存储</el-radio>
            <el-radio :label="3">归档存储</el-radio>
          </el-radio-group>
        </div>
        <div class="edit-dialog">
          <div class="name">上传对象</div>
          <el-radio-group v-model="logValue2">
            <el-radio :label="1">文件整体上传</el-radio>
            <el-radio :label="2">文件分段上传</el-radio>
          </el-radio-group>
        </div>
        <div class="edit-dialog">
          <div class="name"></div>
          <el-button type="primary" size="small">选择文件</el-button>
        </div>
        <div class="edit-dialog">
          <div class="name"></div>
          <plist ref="pList" size="mini" :tableData="tableData2" :tableColumn="tableColumn2" :hasIndex="false" >
        </plist>
        </div>
        <div class="edit-dialog">
          <div class="name">服务端加密</div>
          <el-radio-group v-model="logValue3">
            <el-radio :label="1">SSE-KMS</el-radio>
            <el-radio :label="2">SSE-OBS</el-radio>
            <el-radio :label="3">不加密</el-radio>
          </el-radio-group>
        </div>
      </pdlog>
      <!-- 消息弹窗 -->
      <pdlog v-model="showTip" width="418px" :title="tipName" @comfirm="showTip = false" @cencel="showTip = false">
        <div class="btn-msg">
          请确认是否进行{{tipName}}？
        </div>
      </pdlog>
    </div>
  </template>
  
  <script>
    import listPage from '@/components/listPage'
    import {getStroageSilo} from '@/api/pageList'

    export default {
      data() {
        return {
          tableData3:[
            {aaa:'2023:-2-2 12:12:1（最新）',bbb:'14.5kb',ccc:'删除',},
            {aaa:'2023:-2-2 12:12:1',bbb:'14.5kb',ccc:'删除',},
          ],
          tableColumn3:[{
              field: "aaa",
              label: "最新修改时间",
            },{
              field: "bbb",
              label: "存储类型",
            },{
              field: "ccc",
              label: "操作",
            },],
          tableData2:[
            {aaa:'都一样',bbb:'文件1',ccc:'14.5kb',ddd:'删除'},
            {aaa:'都一样',bbb:'文件1',ccc:'14.5kb',ddd:'删除'},
          ],
          tableColumn2:[{
              field: "aaa",
              label: "文件ID",
            },{
              field: "bbb",
              label: "名称",
            },{
              field: "ccc",
              label: "大小",
            },{
              field: "ddd",
              label: "操作",
            },],
          tipName:'',
          showTip:false,
          addBtnList:[],
          btnList:[
            {
              id:1,
              name:'上传对象',
              handle:this.uploadObj
            },
            {
              id:2,
              name:'删除对象',
              handle:()=>this.handleClick('删除')
            },
          ],
          options: [
            
          ],
          showLog: false, // 控制台弹窗
          logValue: 1, // 控制台值
          logValue2: 1, // 控制台值
          logValue3: 1, // 控制台值
          editValue: null, // 编辑值
          showEdit: false, // 编辑弹窗
          showColumn: [], // 展示列
          tableColumn: [{
              field: "name",
              label: "名称",
            },
            {
              field: "aaa",
              label: "存储类别",
              sortable: true
            },
            {
              field: "bbb",
              label: "大小",
              sortable: true
            },
            {
              field: "ccc",
              label: "最后修改时间",
              sortable: true
            },
            {
              field: "operation",
              type: "handler",
              label: "操作",
              width:300,
              btnlist: [
                {
                  name: '查看版本',
                  handle: this.handleEdit
                },

              ]
            },
          ],
          tableData: [],
        }
      },
      components: {
        listPage,
      },
      created() {
        this.init()
      },
      methods: {
        uploadObj(){
          this.showLog = true
        },
        init(){
          this.showColumn = this.tableColumn
          this.getData()
        },
        getData(params={}){
          // console.log('~~~~~~~~~',params)
          // 请求
          // getStroageSilo().then(res => {
          //   if(res.code==200){
          //     let data = JSON.parse(res.data)
          //     this.tableData = data
          //     console.log('~~~~~~',this.tableData);
          //   }
          // })
          this.$nextTick(()=>{
            this.tableData = [
              {name:'bms-001/dhsjahjjs',aaa:'bms-001/dhsjahjjs',bbb:'az0.dc0',ccc:'13.32.1.1'},
              {name:'bms-001/dhsjahjjs',aaa:'bms-001/dhsjahjjs',bbb:'az0.dc0',ccc:'13.32.1.1'},
              {name:'bms-001/dhsjahjjs',aaa:'bms-001/dhsjahjjs',bbb:'az0.dc0',ccc:'13.32.1.1'},
              {name:'bms-001/dhsjahjjs',aaa:'bms-001/dhsjahjjs',bbb:'az0.dc0',ccc:'13.32.1.1'},
              {name:'bms-001/dhsjahjjs',aaa:'bms-001/dhsjahjjs',bbb:'az0.dc0',ccc:'13.32.1.1'},
              {name:'bms-001/dhsjahjjs',aaa:'bms-001/dhsjahjjs',bbb:'az0.dc0',ccc:'13.32.1.1'},
            ]
          })
        },
        handleAdd() {
          console.log('跳转新增页');
          this.$router.push({
            path: '/saveresource/backetSaveAdd'
          })
        },
        selectedData(){
          return this.$refs.listPageRef.getSelectedData()
        },
        handleClick(name) {
          this.tipName = name
          // 获取选中数据
          let selectRow = this.selectedData()
          console.log('@@@@@@',)
          this.showTip = true
  
          // this.$axios.get('http://47.95.194.212:6601/api/physical').then(res=>{
          //   console.log('@@@@@',res)
          // })
        },
        handleccc() {
          console.log('6666666666666');
        },
        setTable() {
          this.$refs.settingTable.init()
        },
        handleLog(index, row) {
          console.log(index, row);
          this.showLog = true
        },
        handleEdit(index, row) {
          console.log(index, row);
          this.showEdit = true
        },
        handleDetail(index, row) {
          console.log(index, row);
        },
      }
    }
  </script>
  
  <style scoped lang="less">
    .edit-dialog {
      margin: 0px 20px 10px;
      display: flex;
      align-items: center;
      .name {
        min-width: 80px;
        font-weight: 650;
        font-size: 16px;
        color: rgba(0, 0, 0, 0.847058823529412);
        margin-right: 35px;
      }
      .el-input {
        width: 233px;
      }
    }
  </style>
  